<template>
  <div id="app">
    实时更新
    <h1 v-text="count"></h1>
    <button @click="change('add')">增加</button>
    <button @click="change('sub')">增加</button>
  </div>
</template>

<script>
export default {
  computed: {
    // 接收vuex的count数据
    count() {
      return this.$store.state.count;
    },
  },
  methods: {
    change(type) {
      //1. 不建议直接修改store中的数据
      // this.$store.state.count++
      // 可以在commit进程中进行修改
      this.$store.commit("changeCount", { type, step: 20 });
    },
  },
};
</script>

<style>
</style>

